<style >
    #qrcode img{
        margin: 0 auto;
    }
    .qrcode{
        background: #fff;
        width: 90%;
        margin: 16px auto;
        text-align: center;
    }
    .qrcode_title{
        height: 1.2rem;
        line-height: 1.2rem;
        font-size: 16px;
        background: #EFF3FA;
        color: #4F8BF4;
    }
</style>
<style scoped>
    .button{
        width: 100%;
        background: #4F8BF4;
        border: 0;
        padding: 10px 0;
        color: #fff;
        border-radius: 7px;
    }
</style>
<template>
    <div style="font-size: 12px;">
        <div v-wechat-title="$route.meta.title"></div>
        <div style="height:16px;"></div>
        <!-- 二维码模块 -->
        <div class="qrcode">
            <div class="qrcode_title">收款二维码</div>
            <div>
                <div style=" margin: 10px 0;">
                    <div style="font-size: 14px;  margin-bottom: 10px;">保存图片，打开云闪付扫一扫</div>
                    <div id="qrcode" ref="qrcode"></div>
                    <div style="font-size: 20px; margin-top: 10px;">￥{{ GLOBAL.queren }}</div>
                </div>
                <div style="width: 90%; margin: 0 auto;">
                    <hr style="border:0;border-bottom:1px solid #f2f2f2;">
                    <div style="color: #949494; padding: 10px 0;  text-align: left;">订单号：{{this.GLOBAL.orderNo}}</div>
                </div>
            </div>
        </div>
        <!-- 保存图片 -->
        <div style="width:90%;margin:0 auto;">
            <button class="button" @click="button">保存图片</button>
        </div>
        <!-- 温馨提示 -->
        <div style="width:90%;margin:0 auto; margin-top: 27px;">
            <p>温馨提示</p>
            <div>
                1.请点击保存图片按钮或截图，将此二维码保存在手机相册中 <br>
                2.打开【云闪付】APP，点击【扫一扫】，选择相册，选中您保存的二维码即可完成付款
            </div>
        </div>
    </div>
</template>
<script>
 import QRCode from "qrcodejs2";
export default {
    data(){
        return {}
    },
    created(){
        this.$nextTick(() => {
            this.qrcodecode();
        });
    },
    methods:{
        qrcodecode(){
            self=this
            let qrcode = new QRCode("qrcode", {
                width: 100,
                height: 100,
                text: this.GLOBAL.payUrl
            })
        },
        button(){
            // alert(123)
            try {
                if(this.GLOBAL.terminal == 'iOS' ){
                    window.webkit.messageHandlers.nativeScreenshot.postMessage("123");
                }else{
                    qrcoded.qrcode()
                }
            }catch(e) {
                // alert(e)
                console.log("错误", e)
            }
        }
        
    }
}
</script>